<template>
  <a-modal
    :title="$t('导入年票次票')"
    :width="700"
    :visible="visible"
    :confirmLoading="uploading"
    @cancel="handleClose"
    @ok="handleImport"
  >
    <a-spin :spinning="uploading" style="padding: 0 20px">
      <a-row style="margin-bottom:20px;">
        <a-col>
          <span style="opacity:0;">*</span><span style="color:#666;">{{$t('导入模板')}}：</span>
          <a-button type="primary" icon="download" @click="handleExportXls($t('年票次票导入模板'))">{{$t('下载模板')}}</a-button>
        </a-col>
      </a-row>
      <a-row style="margin-bottom:20px;">
        <a-col>
          <span style="color:#F00;">*</span><span style="color:#666;">{{$t('导入文件')}}：</span>
          <a-input style="width:400px;margin-right:6px;vertical-align: bottom;" :placeholder="$t('请选择要导入的文件')" disabled v-model="filename"></a-input>
          <a-upload
            name="file"
            accept=".xls, .xlsx"
            :fileList="fileList"
            :showUploadList="false"
            :multiple="false"
            :headers="tokenHeader"
            :remove="handleRemove"
            :beforeUpload="beforeUpload"
            :customRequest="customRequest"
          >
            <a-button style="background:#F59B1E;color:#FFF;border-color:#F59B1E;">
              {{$t('选择')}}
            </a-button>
          </a-upload>
        </a-col>
      </a-row>
    </a-spin>
  </a-modal>
</template>

<script>
import Vue from 'vue'
import { ACCESS_TOKEN, TENANT_ID } from "@/store/mutation-types"
import { downFile,postAction } from '@/api/manage'
export default {
  name: 'ImportMemberTicketModal',
  data() {
    return {
      visible: false,
      uploading: false,
      fileList: [],
      filename:'',
    }
  },
  computed: {
    tokenHeader(){
      let head = {'X-Access-Token': Vue.ls.get(ACCESS_TOKEN)}
      let tenantid = Vue.ls.get(TENANT_ID)
      if(tenantid){
        head['tenant-id'] = tenantid
      }
      return head;
    }
  },
  mounted() {},
  methods: {
    handleExportXls(fileName){
      if(!fileName || typeof fileName != "string"){
        fileName = "导出文件"
      }
      let url=window._CONFIG['domianURL'] + 'importTemplate/门票信息导入模板.xls'
      let link = document.createElement('a')
      link.style.display = 'none'
      link.href = url
      link.download = fileName
      document.body.appendChild(link)
      link.click()
      document.body.removeChild(link); //下载完成移除元素
      window.URL.revokeObjectURL(url); //释放掉blob对象
      return
    },
    handleClose() {
      this.visible = false
    },
    show() {
      this.fileList = []
      this.filename=''
      this.uploading = false
      this.visible = true
    },
    handleRemove(file) {
      const index = this.fileList.indexOf(file)
      const newFileList = this.fileList.slice()
      newFileList.splice(index, 1)
      this.fileList = newFileList
    },
    beforeUpload(file) {
      let that=this
      that.fileList = [file]
      that.filename=file.name
      that.$message.success(`${file.name} ` + that.$t('文件上传成功'))
      return false
    },
    customRequest(data) {
      // 上传提交
      let that=this
      that.fileList = [data.file]
    },
    handleImport() {
      let that=this
      const { fileList } = that
      if(fileList.length==0){
        that.$message.warning(that.$t('请选择要导入的年票次票文件'))
        return
      }
      const formData = new FormData()
      fileList.forEach(file => {
        formData.append('files[]', file)
      })
      that.uploading = true
      postAction('member/bisMemberTicket/importExcel', formData).then(res => {
        if (res.success) {
          if (res.code == 201) {
            that.errorTip(res.message, res.result)
          } else {
            that.$message.success(res.message)
          }
          that.visible = false
          that.$emit('ok')
        } else {
          that.$message.warning(res.message)
        }
      }).finally(()=>{
        that.uploading = false
      })
    },
    // 错误信息提示
    errorTip(tipMessage, fileUrl) {
      const h = this.$createElement
      let href = window._CONFIG['domianURL'] + fileUrl
      this.$warning({
        title: this.$t('导入成功,但是有错误数据'),
        content: h('div', {}, [
          h('div', tipMessage),
          h('span', this.$t('具体详情请 ')),
          h(
            'a',
            {
              attrs: {
                href: href,
                target: '_blank'
              }
            },
            this.$t('点击下载')
          )
        ]),
        onOk() {}
      })
    }
  }
}
</script>

<style scoped>
</style>